Başarılı Dağıtımdan Sonra Cloudflare Workers 404 Hatasını Çözme

Cloudflare Çalışanlarıyla Hazırlama Ortamı Sorunlarını Giderme

Geliştirme sürecinin önemli bir aşaması, güncellemelerin yayınlanmadan önce uygun şekilde test edilebilmesi için bir hazırlama ortamı oluşturmaktır. Bu örnekte, Cloudflare Çalışanları ana web sitesini geliştirme aşamasında iyi çalışır halde tutuyordu.

Mevcut Git deposunu klonladıktan ve onu Cloudflare Workers & Pages aracılığıyla hazırlama ortamına bağladıktan sonra her şey yolunda gidiyor gibi görünüyordu. Günlükler, dağıtımın başarılı olduğunu gösteriyordu; bu da genellikle canlı bir örneğin oluşturulduğunun sinyalini veriyordu.

Ancak geliştirici verilen Cloudflare adresine erişmeye çalıştığında bir 404 hata mesajı göründü ve neyin yanlış gittiğinden emin olamadı. Bu tür sorunlarla uğraşmak can sıkıcı olabilir, özellikle de sunucunun dağıtımdan hemen sonra yayına alınması gerektiğine inanıldığında.

Yeni deponun tamamen etkinleştirilmesi için ikinci bir sunucuya mı ihtiyaç duyulduğu veya yapılması gereken başka bir şey olup olmadığı belli değil. Bu 404 sorununun nedenlerine ve Cloudflare Workers sunucusunun hazırlama ortamı için doğru şekilde nasıl kurulacağına bu yazımızda bakacağız.

Cloudflare Çalışanları ve Komut Dosyaları 404 Hatalarını Nasıl Ele Alır?

Verilen örnekteki ilk komut dosyası nasıl kullanılacağını gösterir JavaScript ön uçta bir 404 hatasını işlemek için. Komut dosyası şunları kullanır: pencere.yükleme sayfanın tamamen yüklenmesini beklemek için olay. Sayfa şunları yapar: gidip getirmek Kaynağın yüklendikten sonra kullanılabilir olup olmadığını görmek için istekte bulunun. Kaynağın 404 hatası vermesi durumunda kullanıcı özelleştirilmiş bir hata sayfasına gönderilir. Arka uç katılımına gerek olmayan bu teknik, özellikle doğrudan kullanıcının tarayıcısındaki hataları yönetmek ve eksik sayfalar veya kaynaklar için bir geri dönüş sağlamak için kullanışlıdır.

İkinci örnekte, komut dosyası istekleri bir kullanarak yönetir. Cloudflare Çalışanı arka uca doğru ilerledikçe. İşçi şunu kullanır: addEventListener Olayları dinleme ve getirme istekleri yapıldığında müdahale etme yöntemini kullanır. İstenen sayfanın mevcut olmaması nedeniyle 404 hatası oluşması durumunda, çalışan dinamik olarak özelleştirilmiş bir hata sayfası sağlayacaktır. Bu strateji, sunucu yanıtlarını yönetmek için iyi çalışır ve özellikle üretim ve hazırlama veya dinamik içerik gibi çeşitli bağlamlarla çalışırken hataları ele almanın daha uyarlanabilir ve güvenli bir yolunu sunar.

Ön uç ve arka uç komut dosyalarının dağıtıldığından ve doğru şekilde çalıştığından emin olmak için üçüncü örnekte birim testi tanıtılmıştır. Cloudflare Pages dağıtımının aşağıdakileri kullanarak doğru HTTP durum kodlarını döndürüp döndürmediğini görmek için otomatik testler yapar: Node.js ve Mocha gibi bir test çerçevesi. Ana sayfaya yönelik testler (200 durumunu varsayarlar) ve var olmayan bir sayfaya yönelik testlerin (404 durumunu beklerler) her ikisi de test paketine dahil edilmiştir. Bu testler, her şeyin plana göre dağıtıldığından ve bozuk sayfa veya bağlantıların uygun yanıtla sonuçlandığından emin olmanızı sağlar.

Ayrıca testlerin kullanımı ileri sürmek komutlar, yanıt durum kodlarındaki herhangi bir farklılığın hemen tespit edilmesini garanti eder. Kesinti süresini veya bağlantı kopmalarını önlemek için dağıtım davranışının sağlanmasının hayati önem taşıdığı sürekli entegrasyon ve dağıtım (CI/CD) işlem hatlarında testler vazgeçilmezdir. Her şey göz önüne alındığında, ön uç yeniden yönlendirmesi, arka uç hata işleme ve birim testinin birleştirilmesi, Cloudflare Workers dağıtımınızın, kaynakların yokluğu veya hazırlama sunucusu gibi özelleştirilmiş koşullar karşısında bile sorunsuz çalışmasını garanti etmek için kapsamlı bir yaklaşım sunar.

// Frontend JavaScript for handling redirection
// This script checks if a resource is available on the Cloudflare page
// If not, it redirects to a fallback page
window.onload = function () {
  fetch(window.location.href)
    .then(response => {
      if (response.status === 404) {
        window.location.href = '/404.html';  // Redirect to custom 404 page
      }
    })
    .catch(error => {
      console.error('Error fetching the page:', error);
      window.location.href = '/error.html';  // Redirect to error page
    });
};

// Cloudflare Worker script for managing 404 errors
// The script checks if the requested path exists, and if not, returns a custom 404 page
addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request));
});
async function handleRequest(request) {
  try {
    const response = await fetch(request);
    if (response.status === 404) {
      return new Response('Custom 404 Page', { status: 404 });
    }
    return response;
  } catch (error) {
    return new Response('Error occurred: ' + error.message, { status: 500 });
  }
}

// Example unit test for deployment verification
// Using JavaScript to ensure that Cloudflare Pages return the correct response
const assert = require('assert');
const fetch = require('node-fetch');
describe('Cloudflare Deployment Test', function() {
  it('should return 200 for the main page', async function() {
    const response = await fetch('https://your-domain.pages.dev');
    assert.equal(response.status, 200);
  });
  it('should return 404 for non-existent page', async function() {
    const response = await fetch('https://your-domain.pages.dev/unknown');
    assert.equal(response.status, 404);
  });
});

Cloudflare Çalışanlarının Hazırlama Ortamını Anlamak

Geliştirme amacıyla, bir hazırlama ortamının kurulması, aşağıdakilerle çalışırken çok önemli olabilir: Cloudflare Çalışanları. Geliştiriciler, uygulamalarını üretim sunucusuna dağıtmadan önce bir hazırlama ortamında test edebilirler. Belirtilen 404 hatası gibi sorunların önüne geçebilmek için bu ortamın ilk kurulduğunda uygun şekilde yapılandırılması gerekmektedir. Geliştiriciler sıklıkla canlı bir sunucu başlatmak için gereken tek şeyin GitHub deposunu klonlamak ve onu Cloudflare Sayfalarına bağlamak olduğuna inanıyor. Cloudflare statik siteleri otomatik olarak dağıtsa da çalışanın yönlendirme yapılandırması doğru kurulmazsa sorunlar ortaya çıkabilir.

404 hatası genellikle isteğin sunucu tarafından düzgün bir şekilde ele geçirilmediği anlamına gelir. İşçi. Cloudflare Çalışanlarının isteklerin doğru yere gönderildiğini garanti etmesi için özel yönlendirme kuralları gereklidir. Site açıldıktan sonra bile, bu rotalar ayarlanmadığı takdirde bazı sayfalara yönelik istekler 404 hatası döndürebilir. Worker komut dosyasının hazırlama alanına bağlı olmasını sağlamak da çok önemlidir. Bu hatalar, geliştirme sırasında iyi organize edilmiş bir İşçi kullanılarak ve rotaların doğrulanmasıyla azaltılabilir.

İşçinin hala cihazınıza bağlı olmasını sağlamak evreleme alanı bir başka önemli adımdır. Çalışan, özellikle birden fazla ortamın (üretim ve hazırlama gibi) mevcut olduğu durumlarda, dağıtım sırasında zaman zaman kendisini yeni ortama otomatik olarak bağlamakta başarısız olabilir. Worker'ı belirli bir ortama manuel olarak bağlamak ve istekleri uygun şekilde işlediğinden emin olmak için geliştiriciler Cloudflare'in kontrol panelini kullanabilir. Aşama ve üretim ortamlarının sorunsuz ve hatasız çalışması için bu adım gereklidir.