Issue #2262💬 RespondidoAbierto el 10 de septiembre de 2019por raghuv9Reacciones 0

Bloqueado por la política de cors No hay cabecera 'Access-Control-Allow-Origin' en el recurso solicitado

Respuesta rápidapor pouyamiralayi

¡Hola! Necesitas un conjunto de reglas como este: En tu política de seguridad de servidor, con el origen configurado a la dirección que despliegues tu cliente Grapesjs, por defecto a localhost en el caso anterior.

Lee la respuesta completa abajo ↓

Pregunta

Fragmento de códigoTEXT
Hola, estoy usando grapesjs con vuelt, no puedo cargar una página web usando la URL. Cargar: de uvapesjs estoy teniendo un problema de cors, soy bastante nuevo en el mundo de uvapesjs, por favor, ayudadme. Gracias de antemano.
Aquí está mi código
---------------------------------------------------------------------------------------------------------
importar uvas de 'uvas';

importar 'grapesjs/dist/css/grapes.min.css';
importar 'grapesjs-preset-newsletter/dist/grapesjs-preset-newsletter.css';
importar 'grapesjs-preset-webpage/dist/grapesjs-preset-webpage.min.css';

importa gjspresetnewsletter de 'grapesjs-preset-newsletter';
importar gjspresetwebpage desde 'grapesjs-preset-webpage';

exportar default {
        data() {
            return {
                editor: null
            }
        },
        Métodos: {
            cambio() {
                this.$emit('change', this.editor.getHtml());
            },
        },
          montado() {
                const LandingPage = {
                componentes: nulo,
                estilo: nulo,
                };
                this.editor = grapesjs.init({
                contenedor: "#gjs",
                lienzo: {
                     Estilos: [""],
                },
                fromElement: cierto,
                componentes:'',
                Estilo: '',
                Plugins: [],
                pluginsOpts: {
                    "gjs-preset-webpage": {}
                },
                 storageManager: {
                    Tipo: 'A distancia',
                    pasosAntesDeguardar: 10,
                    urlStore: '',
                    urlLoad: 'https://grapesjs.com/docs/modules/Storage.html#setup-the-server',
                    params: {}, 
                    contentTypeJson: cierto,
                    cabeceras: {
                        'Tipo de contenido': 'aplicación/json'
                    },
                     json_encode:{
                         'componentes GJS': [],
                          'estilo GJS': [],
                     }
                    
},
                });
                this.editor.load=(res => console.log('Load callback'));
        }
    }

Respuestas (3)

pouyamiralayi10 de septiembre de 2019

¡Hola! Necesitas un conjunto de reglas como este:

"cors": {
    "habilitado": cierto,
    "origen": "http://localhost:3000",

En tu política de seguridad de servidor, con el origen configurado a la dirección que despliegues tu cliente Grapesjs, por defecto a localhost en el caso anterior.

pouyamiralayi10 de septiembre de 2019

y en tu configuración de storageManager cambia la entrada de parámetros así:

 params:{
             'Access-Control-Allow-Origin':'http://localhost:3000',
        }

Salud.

raghuv910 de septiembre de 2019

y en tu configuración storageManager cambia la entrada params así:

parágrafos:{
'Access-Control-Allow-Origin':'http://localhost:3000',
        }

salud.

Hola, sigo teniendo el mismo problema. Aquí está mi código. He incluido todos los cambios que sugieres, por favor, dime dónde estoy fallando. montado() { const LandingPage = { componentes: nulo, estilo: nulo, }; this.editor = grapesjs.init({ contenedor: "#gjs", lienzo: { Estilos: [""], }, fromElement: cierto, componentes:'', Estilo: '', Plugins: [], pluginsOpts: { "gjs-preset-webpage": {} }, "cors":{ "habilitado": cierto, "origen": "http://laravel-vue-spa.test", }, storageManager: { Tipo: 'A distancia', pasosAntesDeguardar: 10, urlStore: '', urlLoad: 'https://grapesjs.com/docs/modules/Storage.html#setup-the-server', params:{ 'Access-Control-Allow-Origin':'http://laravel-vue-spa.test', }, contentTypeJson: cierto, cabeceras: { 'Tipo de contenido': 'aplicación/json' }, json_encode:{ 'componentes GJS': [], 'estilo GJS': [], } }, }); this.editor.load=(res => console.log('Load callback')); }

Preguntas y respuestas relacionadas

Continúa investigando con debates sobre temas similares.

Plugins de pago que cumplen con este problema

Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.

Ver todos los plugins

Cargando recomendaciones de plugins de pago...

Opción gratuita

Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.

Explora plugins gratuitos →
Opción premium

Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.

Explora plugins premium →

Explorar categorías de plugins

Ve directamente a las páginas de categorías de plugins en el marketplace.