Testing app locally in browser?

Question

Testing app locally in browser?

Navigation

#1 by (1 votes)

2

I am trying to develop a hybrid application using ionic and angularjs and for this I am testing in the browser.

When I do ionic serve it creates a local server with the address localhost:8100/#/main and my webservice is also in localhost on port 80.

When I try to do some ajax request for this webservice Firefox returns me the message:

Blocked cross-origin request: Same Origin Policy prevents reading of the remote resource in http://localhost/AppPanel/users/doLogin.json . (Reason: CORS 'Access-Control-Allow-Origin' header is not present). '

I tried to disable this check in Firefox like this: about:config -> security.fileuri.strict_origin_policy -> false but I could not get results yet. I made my webservice in CakePHP.

How do I solve this problem?

angularjs cakephp ionic firefox

asked by anonymous 13.11.2015 / 03:15

1 answer

result obtained does not match the actual result Change data in DB4O in C #

score 1 · Answer 1

You have bypassed the security of the app and backend by disabling CORS. To configure CORS on the client and server (in the development environment) I do this:

index.html:

<meta http-equiv="Content-Security-Policy"
        content="default-src *;
               script-src 'self' 'unsafe-inline' 'unsafe-eval'
                           127.0.0.1:*
                           http://*.gstatic.com          
                           http://*.googleapis.com
                           https://*.gstatic.com
                           https://*.googleapis.com
                           ;
               style-src  'self' 'unsafe-inline'
                           127.0.0.1
                           http://*.gstatic.com         
                           http://*.googleapis.com
                           https://*.gstatic.com
                           https://*.googleapis.com
    ">

in your backend , set the headers to accept source 127.0.0.1 (example in RubyOnRails):

def set_headers    #este é um before_filter no controller
    if request.env['HTTP_ORIGIN'] and request.env['HTTP_ORIGIN'].match(/^http:\/\/127\.0\.0\.1/)
        headers['Access-Control-Allow-Origin'] = '*'
        headers['Access-Control-Allow-Methods'] = 'GET' #'POST, PUT, DELETE, GET, OPTIONS'
        headers['Access-Control-Request-Method'] = '*'
        headers['Access-Control-Allow-Headers'] = 'Origin' #'Origin, X-Requested-With, Content-Type, Accept, Authorization'
        puts "PERMITINDO CORS PARA ORIGIN: #{request.env['HTTP_ORIGIN']}"
    else
        #puts "HTTP_ORIGIN é nil => REQUEST.ENV => #{request.env}"
    end
end

You should serve the app like this:

ionic serve --address 127.0.0.1