token.js 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. /**
  2. * @license Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  4. */
  5. /* globals console, window, document, XMLHttpRequest */
  6. import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
  7. import ArticlePluginSet from '@ckeditor/ckeditor5-core/tests/_utils/articlepluginset';
  8. import CloudServices from '../../src/cloudservices';
  9. import { TOKEN_URL, UPLOAD_URL } from '../_utils/cloud-services-config';
  10. const output = document.getElementById( 'output' );
  11. const requestOutput = document.getElementById( 'request' );
  12. ClassicEditor
  13. .create( document.getElementById( 'editor' ), {
  14. cloudServices: {
  15. tokenUrl: getToken,
  16. uploadUrl: UPLOAD_URL
  17. },
  18. plugins: [ ArticlePluginSet, CloudServices ],
  19. toolbar: [ 'heading', '|', 'undo', 'redo' ]
  20. } )
  21. .then( editor => {
  22. window.editor = editor;
  23. } )
  24. .catch( err => {
  25. output.innerText = err.message;
  26. console.error( err.message );
  27. } );
  28. function handleRequest( xhr, resolve, reject ) {
  29. requestOutput.innerHTML = `
  30. <div>XHR request: <pre class='xhr-data'></pre></div>
  31. <button class="resolve">Resolve with the xhr response</button>
  32. <button class="reject">Reject with an error</button>
  33. `;
  34. const xhrSpan = requestOutput.querySelector( '.xhr-data' );
  35. const xhrData = {
  36. status: xhr.status,
  37. response: xhr.response
  38. };
  39. xhrSpan.innerText = JSON.stringify( xhrData, null, 2 );
  40. const resolveButton = requestOutput.querySelector( '.resolve' );
  41. resolveButton.addEventListener( 'click', () => resolve( xhr.response ) );
  42. const rejectButton = requestOutput.querySelector( '.reject' );
  43. rejectButton.addEventListener( 'click', () => reject( new Error( 'Cannot download new token!' ) ) );
  44. }
  45. function getToken() {
  46. return new Promise( ( resolve, reject ) => {
  47. const xhr = new XMLHttpRequest();
  48. xhr.open( 'GET', TOKEN_URL );
  49. xhr.addEventListener( 'load', () => {
  50. handleRequest( xhr, resolve, reject );
  51. } );
  52. xhr.addEventListener( 'error', () => reject( new Error( 'Network Error' ) ) );
  53. xhr.addEventListener( 'abort', () => reject( new Error( 'Abort' ) ) );
  54. xhr.send();
  55. } ).then( response => {
  56. output.innerText = `Response: ${ response }`;
  57. return response;
  58. } );
  59. }