htaccess Access-Control-Allow-Origin


134

Estou criando um script que carrega externamente em outros sites. Carrega CSS e HTML e funciona bem em meus próprios servidores.

No entanto, quando eu tento em outro site, ele exibe esse erro terrível:

Access-Control-Allow-Origin

Aqui você pode ver que ele carrega perfeitamente: http://tzook.info/bot/

Mas neste outro site, mostra o erro: http://cantloseweight.co/robot/

Carreguei o script de carregamento no jsfiddle: http://jsfiddle.net/TL5LK/

Eu tentei editar o arquivo htaccess assim:

<IfModule mod_headers.c>    
    Header set Access-Control-Allow-Origin *
</IfModule>

Ou assim:

Header set Access-Control-Allow-Origin *

Mas ainda não funciona.

Respostas:


269

Tente isso no .htaccess da pasta raiz externa:

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

E se se trata apenas de scripts .js, você deve agrupar o código acima dentro deste:

<FilesMatch "\.(js)$">
...
</FilesMatch>

6
Ótimos conselhos sobre o uso FilesMatch.
Nate

1
se correspondermos aos arquivos adicionando o bloco filesmatch, o que *fará?
shenkwen

E preciso reiniciar o servidor depois de fazer isso? Aplico o código acima, mas ele ainda não me permite acessar \ .json, mudei jspara json.
shenkwen

3
@shenkwen O *permite que qualquer domínio de origem acesse este recurso. Não é uma lista de recursos, mas uma lista de domínios de referência.
SparK

3
Caso isso não funcione, tente ativar o headersmódulo:a2enmod headers
Joaquín O

53

ninguém diz que você também precisa ativar o mod_headers ; portanto, se ainda não estiver funcionando, tente o seguinte:

(as dicas a seguir funcionam no Ubuntu, não conheço outras distribuições)

você pode verificar a lista de módulos carregados com

apache2ctl -M

para habilitar mod_headers você pode usar

a2enmod headers

é claro que, após qualquer alteração no Apache, você deve reiniciá-lo:

/etc/init.d/apache2 restart

Então você pode usar

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

E se mod_headers não estiver ativo, essa linha não fará nada. Você pode tentar pular a cláusula if e apenas adicionar Header set Access-Control-Allow-Origin "*"sua configuração, então deve ocorrer um erro durante o início se mod_headers não estiver ativo.


3
tentei todas as opções que pude encontrar no Google e, como você disse, ninguém disse nada sobre mod_headers. Obrigado!
Sirkong 6/09/16

1
Meus mod_headers estão ativos e adicionaram esta linha em .htaccess (no mesmo local mencionado), mas ainda estou recebendo este erro: A resposta para preflight possui um código de status HTTP inválido 400..Pls sugerem!
Sushivam

1
mod_headers era a coisa que faltava! Isso está funcionando perfeitamente com a regra .htaccess. Obrigado.
Andy

@SachinS um erro de 400 não foi encontrado, 500 é um erro de servidor. Comece por aí.
Andy

30

da minha experiência;

se não funcionar de dentro, phpfaça isso .htaccess, funcionou para mim

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin http://www.vknyvz.com  
    Header set Access-Control-Allow-Credentials true
</IfModule>
  • credenciais podem ser verdadeiras ou falsas, dependendo dos parâmetros de solicitação do ajax

Isso não funcionou para mim, mas eu consegui fazê-lo funcionar no php, mesmo princípio.
RevNoah

16

Adicione um .htaccessarquivo com as seguintes diretivas à sua pasta de fontes, se tiver problemas para acessar suas fontes. Pode ser facilmente modificado para uso com arquivos .css ou .js .

<FilesMatch "\.(eot|ttf|otf|woff)$">
    Header set Access-Control-Allow-Origin "*"
</FilesMatch>

1
Deve-se observar que a <FilesMatch>diretiva acima é desnecessária, se , como sugerido acima, seu .htaccessarquivo estiver no diretório de fontes e o diretório de fontes contiver apenas.eot ,. ttf, .otfE / ou .woffarquivos.
Mesagoma 07/02

9

As outras respostas não funcionaram para mim, foi o que acabou fazendo o truque para o apache2:

1) Habilite o mod de cabeçalhos:

sudo a2enmod headers

2) Crie o /etc/apache2/mods-enabled/headers.confarquivo e insira:

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

3) Reinicie seu servidor:

sudo service apache2 restart


Esta é a única solução que funcionou para mim no meu servidor Ubuntu 16.10.
kneeki

Isso funcionou também para mim. Estou usando o servidor Ubuntu 16.04. Obrigado.
jhedm

Trabalhou para mim no Ubuntu 18.04. O Firefox 70.0.1 não estava satisfeito apenas com o cabeçalho Access-Control-Allow-Origin, e eu tive que adicionar o método Access-Control-Allow-Methods.
borizzzzz

@songololo Não consegui localizar este arquivo para apache no Centos 7. Procurei em todos os lugares no diretório / etc / httpd. Você pode me informar como posso implementá-lo no Centos?
Mainuddin 11/07

@Mainuddin, desculpe, eu não estou familiarizado com o Centos. Espero que alguém possa
entrar

7

No Zend Framework 2.0, eu tive esse problema. Pode ser resolvido no cabeçalho .htaccess ou php de duas maneiras. Prefiro .htaccess, então modifiquei .htaccess de:

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^.*$ index.php [NC,L]

para

RewriteEngine On

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^.*$ index.php [NC,L]

e começa a funcionar


Isso salvou meu dia, e o htaccess o fez.
Relm

4

BTW: a configuração .htaccess deve ser feita no servidor que hospeda a API. Por exemplo, você cria um aplicativo AngularJS no domínio x.com e cria uma API Rest em y.com, defina Access-Control-Allow-Origin "*" no arquivo .htaccess na pasta raiz de y.com e não x .com :)

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

Além disso, como Lukas mencionou, certifique-se de ativar o mod_headers se você usa o Apache



0

Se o seu host não estiver no pvn ou dedicado, é difícil reiniciar o servidor.

Melhor solução para mim, basta editar seu arquivo CSS (em outro domínio ou subdomínio) que chame a fonte eot, woff etc. para sua origem (seu domínio ou www seu domínio). isso resolverá o seu problema.

Quero dizer, editar URL relativo em CSS para domínio de origem de URL absoluto

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.