I am trying to send a request from my Webstorm application to my backend application, which both are at different ports, I am working with angularJS in the front end and java in backend. I have read up a bit about CORS Filters and I learned that in order to do Cross Origin Requests I need to implement these. However, after doing this my error, being
Failed to load resource: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63343' is therefore not allowed access. http://localhost:8080/register?password=&username=
XMLHttpRequest cannot load http://localhost:8080/register?password=&username=. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63343' is therefore not allowed access.
did not change at all which lead me to believe I have done something wrong, here is the code from which I am sending the request:
var charmanderServices = angular.module('charmanderServices', ['ngResource']);
var hostAdress = "http://localhost:8080";
charmanderServices.factory("register", ["$resource",
function($resource){
console.log('in service');
return $resource(hostAdress + "/register", {}, {
'registerUser' : { method: 'POST', isArray: false,
params: {
username: '@username',
password: '@password'
}
},
headers : {'Content-Type' : 'application/x-www-form-urlencoded'}
});
}
]);
My corsFilter is written like this:
@Component
public class SimpleCORSFilter implements Filter {
public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
//This is not even printing
System.out.println("Cheers lads, I'm in the filter");
HttpServletResponse response = (HttpServletResponse) res;
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with, X-Auth-Token, Content-Type");
chain.doFilter(req, res);
}
public void init(FilterConfig filterConfig) {}
public void destroy() {}
}
This is my web.xml:
<filter>
<filter-name>CORSFilter</filter-name>
<filter-class>com.robin.filters.SimpleCORSFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>CORSFilter</filter-name>
<url-pattern>/register</url-pattern>
</filter-mapping>
</web-app>
This is the controller where I am catching the request:
@Controller
public class UserController {
@Autowired
private UserService userService;
@RequestMapping(value = "/register" , method= RequestMethod.POST, produces = "application/json")
@ResponseBody
public boolean register(@RequestParam(value = "username") String username, @RequestParam(value = "password") String password){
System.out.println("Im in register hurray");
return userService.register(username, password);
}
}
Update: I have tried implementing the filter as a OncePerRequestFilter, still doesn't work. Is anyone able to help me further here?
Update#2: Also tried this one, http://software.dzhuvinov.com/cors-filter-installation.html, no luck
Update#3: This was my output in the console, I can see that the response did not add any headers:
Request URL:http://localhost:8080/register?password=g&username=g
Request Method:OPTIONS
Status Code:200 OK
Request Headersview source
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8,nl;q=0.6
Access-Control-Request-Headers:accept, content-type
Access-Control-Request-Method:POST
Connection:keep-alive
Host:localhost:8080
Origin:http://localhost:63343
Referer:http://localhost:63343/Project/index.html?uName=g&uPassword=g&uPasswordConfirm=g
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/33.0.1750.152 Safari/537.36
Query String Parametersview sourceview URL encoded
password:g
username:g
Response Headersview source
Allow:GET, HEAD, POST, PUT, DELETE, OPTIONS
Content-Length:0
Date:Fri, 04 Apr 2014 09:50:35 GMT
Server:Apache-Coyote/1.1
I am trying to send a request from my Webstorm application to my backend application, which both are at different ports, I am working with angularJS in the front end and java in backend. I have read up a bit about CORS Filters and I learned that in order to do Cross Origin Requests I need to implement these. However, after doing this my error, being
Failed to load resource: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63343' is therefore not allowed access. http://localhost:8080/register?password=&username=
XMLHttpRequest cannot load http://localhost:8080/register?password=&username=. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63343' is therefore not allowed access.
did not change at all which lead me to believe I have done something wrong, here is the code from which I am sending the request:
var charmanderServices = angular.module('charmanderServices', ['ngResource']);
var hostAdress = "http://localhost:8080";
charmanderServices.factory("register", ["$resource",
function($resource){
console.log('in service');
return $resource(hostAdress + "/register", {}, {
'registerUser' : { method: 'POST', isArray: false,
params: {
username: '@username',
password: '@password'
}
},
headers : {'Content-Type' : 'application/x-www-form-urlencoded'}
});
}
]);
My corsFilter is written like this:
@Component
public class SimpleCORSFilter implements Filter {
public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
//This is not even printing
System.out.println("Cheers lads, I'm in the filter");
HttpServletResponse response = (HttpServletResponse) res;
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with, X-Auth-Token, Content-Type");
chain.doFilter(req, res);
}
public void init(FilterConfig filterConfig) {}
public void destroy() {}
}
This is my web.xml:
<filter>
<filter-name>CORSFilter</filter-name>
<filter-class>com.robin.filters.SimpleCORSFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>CORSFilter</filter-name>
<url-pattern>/register</url-pattern>
</filter-mapping>
</web-app>
This is the controller where I am catching the request:
@Controller
public class UserController {
@Autowired
private UserService userService;
@RequestMapping(value = "/register" , method= RequestMethod.POST, produces = "application/json")
@ResponseBody
public boolean register(@RequestParam(value = "username") String username, @RequestParam(value = "password") String password){
System.out.println("Im in register hurray");
return userService.register(username, password);
}
}
Update: I have tried implementing the filter as a OncePerRequestFilter, still doesn't work. Is anyone able to help me further here?
Update#2: Also tried this one, http://software.dzhuvinov.com/cors-filter-installation.html, no luck
Update#3: This was my output in the console, I can see that the response did not add any headers:
Request URL:http://localhost:8080/register?password=g&username=g
Request Method:OPTIONS
Status Code:200 OK
Request Headersview source
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8,nl;q=0.6
Access-Control-Request-Headers:accept, content-type
Access-Control-Request-Method:POST
Connection:keep-alive
Host:localhost:8080
Origin:http://localhost:63343
Referer:http://localhost:63343/Project/index.html?uName=g&uPassword=g&uPasswordConfirm=g
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/33.0.1750.152 Safari/537.36
Query String Parametersview sourceview URL encoded
password:g
username:g
Response Headersview source
Allow:GET, HEAD, POST, PUT, DELETE, OPTIONS
Content-Length:0
Date:Fri, 04 Apr 2014 09:50:35 GMT
Server:Apache-Coyote/1.1
0 commentaires:
Enregistrer un commentaire