Pham Tuan

Some keywords

• Websocket / SocketIO
• HTML5 Server Sent Event
• https://mercure.rocks/

Em mới thử google với keyword "hot deployment single database" thì có bài này, anh thử đọc xem có áp dụng được không. Hình như có khái niệm "Blue-Green Deployment"

http://blog.dixo.net/2015/02/blue-turquoise-green-deployment/

Còn em thường làm là hạn chế breaking change structure

Return exception giống như return value bình thường thôi bạn, nó chỉ dừng function đang chạy và coi như function bạn chạy không có lỗi gì. Lúc này queue cũng xác định là job chạy success và không chạy lại nữa.

Throw exception thì nó dừng function, nếu bạn không try/catch thì exception handler sẽ đứng ra xử lý và do có exception nên queue worker sẽ thực hiện retry. Việc có vòng lặp vĩnh viễn theo mình suy đoán là do bạn không set số lần retry tối đa, ví dụ command php artisan queue:work có option là --tries và giá trị mặc định là 0 tức là retry cho đến khi job chạy success, bạn có thể thử set value cho option này:

php artisan queue:work --tries=3

dontReport tức là để nó không log hay report exception đến các log channels thôi bạn, chứ nó không liên quan đến queue có lặp vĩnh viễn hay không.

Bạn có thể đọc tạm bài này https://viblo.asia/p/how-laravel-handle-exception-L4x5xdeb5BM để hiểu hơn về error handler.

Bonus quote from docs https://laravel.com/docs/5.8/queues#error-handling

Error Handling

If an exception is thrown while the job is being processed, the job will automatically be released back onto the queue so it may be attempted again. The job will continue to be released until it has been attempted the maximum number of times allowed by your application.

Bạn tham khảo trang này thử xem, có khá nhiều thứ phải học

https://github.com/binhnguyennus/awesome-scalability

Làm được nhưng mà không nên bạn à, vì Laravel không recommend cách này, có lỗi gì chưa phát hiện thì bạn phải tự chịu

Ref: https://serversforhackers.com/c/nginx-php-in-subdirectory

Mình nghĩ là do phần validate của ant design là function async (nó dùng cái này https://github.com/yiminghe/async-validator) và phải validate success thì field mới có giá trị.

Còn function onChange => changeTime lại là synchronous function nên nó không đồng bộ với nhau.

Mình suy đoán như vậy chứ không chắc chắn.

Cách giải quyết là gọi setFieldsValue trong changeTime:

  changeTime = (dataIndex, time, timeString) => {
    const { record, handleSave } = this.props;
    const { getFieldValue, setFieldsValue } = this.form;

    setFieldsValue(
      {
        [dataIndex]: time
      },
      () => {
        this.form.validateFields([dataIndex], (error, values) => {
          if (error && error[dataIndex]) {
            console.log("error", error);
            return;
          }
          // ...
        });
      }
    );
  };

Bạn chú ý đến thuộc tính onCell của column nhé:

    const columns = this.columns.map(col => {
      if (!col.editable) {
        return col;
      }
      return {
        ...col,
        onCell: record => ({
          record,
          editable: col.editable,
          dataIndex: col.dataIndex,
          title: col.title,
          handleSave: this.handleSave
        })
      };
    });

onCell được dùng để pass thêm props vào table cell, cụ thể ở đây là custom component EditableCell để trong EditableCell có thể đọc được các prop editable, dataIndex, title...

• https://github.com/react-component/table/blob/680ef3f06d93d22f9e57fce42d60ad2d9526db38/src/TableCell.js#L44
• https://github.com/react-component/table/blob/680ef3f06d93d22f9e57fce42d60ad2d9526db38/src/TableCell.js#L73
• https://github.com/react-component/table/blob/680ef3f06d93d22f9e57fce42d60ad2d9526db38/src/TableCell.js#L97

=> Updated code đây nhé: https://codesandbox.io/s/exciting-hypatia-vvl8e

Mình move onCell lên phần khai báo columns luôn, bạn có thể sửa lại đoạn const columns = this.columns.map cho nó áp dụng cho cả children

Diff:

-import { Table, Input, Button, Popconfirm, Form } from 'antd';
+import { Table, Input, Button, Form } from 'antd';
 
 const EditableContext = React.createContext();
 
@@ -20,12 +20,16 @@ class EditableCell extends React.Component {
     };
 
     toggleEdit = () => {
-        const editing = !this.state.editing;
-        this.setState({ editing }, () => {
-            if (editing) {
-                this.input.focus();
+        this.setState(
+            (prevState) => ({
+                editing: !prevState.editing,
+            }),
+            () => {
+                if (this.state.editing) {
+                    this.input.focus();
+                }
             }
-        });
+        );
     };
 
     save = (e) => {
@@ -78,19 +82,29 @@ class EditableTable extends React.Component {
         this.columns = [
             {
                 title: 'name',
                dataIndex: 'name',
                 children: [
                     {
                         title: 'First Name',
                         dataIndex: 'firstName',
                         width: 100,
-                        editable: true,
+                        onCell: (record) => ({
+                            record,
+                            editable: true,
+                            title: 'First Name',
+                            dataIndex: 'firstName',
+                            handleSave: this.handleSave,
+                        }),
                     },
                     {
                         title: 'Last Name',
                         dataIndex: 'lastName',
                         width: 100,
-                        editable: true,
+                        onCell: (record) => ({
+                            record,
+                            editable: true,
+                            title: 'Last Name',
+                            dataIndex: 'lastName',
+                            handleSave: this.handleSave,
+                        }),
                     },
                 ],
             },
@@ -149,27 +163,19 @@ class EditableTable extends React.Component {
                 cell: EditableCell,
             },
         };
-        const columns = this.columns.map((col) => {
-            if (!col.editable) {
-                return col;
-            }
-            return {
-                ...col,
-                onCell: (record) => ({
-                    record,
-                    editable: col.editable,
-                    dataIndex: col.dataIndex,
-                    title: col.title,
-                    handleSave: this.handleSave,
-                }),
-            };
-        });
+
         return (
             <div>
                 <Button onClick={this.handleAdd} type="primary" style={{ marginBottom: 16 }}>
                     Add a row
                 </Button>
-                <Table components={components} bordered dataSource={dataSource} columns={columns} />
+                <Table
+                    components={components}
+                    rowClassName={() => 'editable-row'}
+                    bordered
+                    dataSource={dataSource}
+                    columns={this.columns}
+                />
             </div>
         );
     }

Bạn đang dùng image nginx:alpine thì không có folder /etc/nginx/sites-enabled và nginx không đọc config từ folder này nhé bạn.

Folder /etc/nginx/sites-enabled thường chỉ có trên Ubuntu/Debian thôi, nó là một convention thôi không phải mặc định.

Đường dẫn đúng ở đây phải là: /etc/nginx/conf.d/default.conf

Bonus: làm sao để biết? Đơn giản là vào trong container kiểm tra thôi : D

docker-compose exec webserver sh
ls /etc/nginx
cat /etc/nginx/nginx.conf

Bạn đang deploy để dev hay deploy production vậy? Nếu deploy production thì ko nên reverse proxy đến ng serve như vậy mà nên dùng ng build và dùng nginx để serve static html.

Cái nữa là nên deploy frontend angular vào location root / và backend api vào /api chẳng hạn, vì cần vào trang frontend là chủ yếu mà nhỉ? Cách này cũng dễ config hơn.

Có vẻ như anh đang nói đến "Signed Url", các cloud storage như Google Storage, AWS S3 đều hỗ trợ get signed urls. https://cloud.google.com/storage/docs/access-control/signed-urls

Ngoài ra e biết có Laravel Framework cũng hỗ trợ generate signed url https://laravel.com/docs/5.8/urls#signed-urls

Có chút ko đọc kỹ tài liệu

Làm sao để tạo ra một môi trường test riêng mà k ảnh hưởng đến dữ liệu của hệ thống

• Đặt tên file env là .env.dusk
• Hoặc đặt tên file env của dusk theo cấu trúc .env.dusk.{APP_ENV}, trong đó {APP_ENV} là giá trị APP_ENV trong file .env. File này sẽ được ưu tiên hơn file .env.dusk

Tham khảo: https://laravel.com/docs/5.7/dusk#environment-handling

Khi chạy " php artisan dusk " dữ liệu sẽ bị rollback?

Dữ liệu sẽ bị rollback hay toàn bộ DB sẽ bị truncate nếu trong test case có sử dụng 1 trong 2 trait RefreshDatabase hoặc DatabaseMigrations, bạn xem lại file test case xem:

<?php

namespace Tests\Browser;

use Tests\DuskTestCase;
use Laravel\Dusk\Browser;
use Illuminate\Foundation\Testing\DatabaseMigrations;
use Illuminate\Foundation\Testing\RefreshDatabase;

class ExampleTest extends DuskTestCase
{
    use RefreshDatabase;
    // use DatabaseMigrations; // OR THIS

    /**
     * A basic browser test example.
     *
     * @return void
     */
    public function testBasicExample()
    {
        $this->browse(function (Browser $browser) {
            $browser->visit('/')
                    ->assertSee('Laravel');
        });
    }
}

Tham khảo:

• https://laravel.com/docs/5.7/dusk#migrations
• https://laravel.com/docs/5.7/database-testing#resetting-the-database-after-each-test

Nó là biến môi trường PS1 trong Bash, khai báo trong file .bashrc, bạn có thể cop từ .bashrc của GitBash hoặc dùng mấy tool này để generate:

• http://ezprompt.net/
• http://bashrcgenerator.com/

Validator có method failed(), return array dạng:

/*
 * Example array of $failedRules
 * [
 *     "password" => [
 *         "Required" => []
 *     ],
 *     "accept_term" => array:1 [
 *         "Accepted" => []
 *     ],
 *     "invitation_code" => array:1 [
 *         "App\Rules\CustomRule" => []
 *     ]
 * ]
 */
$failedRules = $validator->failed();

Bạn có thể dựa vào cái này để check điều kiện cho từng rule

Bonus bạn có thể xử lý lỗi validation tập trung tại class App\Exceptions\Handler.php mà không phải custom từng FormRequest.

Tham khảo: https://github.com/laravel/framework/blob/5.7/src/Illuminate/Foundation/Exceptions/Handler.php#L231

@devil_boom_129

Thường thì chỉ cần config trong file config/app.php thôi, file này cũng ở trong .gitignore rồi, còn nếu muốn dùng file env thì phải sửa lại file config/bootstrap.php: https://github.com/BlazingRockStorm/Calendar-Event/blob/master/config/bootstrap.php#L47,L62

Theo như file docker-compose của bạn thì config/app.php sẽ trông như thế này:

'host' => 'mysql',
/*
 * CakePHP will use the default DB port based on the driver selected
 * MySQL on MAMP uses port 8889, MAMP users will want to uncomment
 * the following line and set the port accordingly
 */
//'port' => 'non_standard_port_number',
'username' => 'root',
'password' => 'root',
'database' => 'schedule',

Test kết nối:

sudo docker-compose exec cakephp ./bin/cake migrations status

# Migrate
sudo docker-compose exec cakephp ./bin/cake migrations migrate

Bonus 1 nếu dùng docker-compose thì có thể sử dụng tên của service thay cho tên container

Bonus 2 đoạn environment trong docker-compose cakephp service cũng không cần nữa https://github.com/BlazingRockStorm/Calendar-Event/blob/master/docker-compose.yml#L17

Không biết bạn bị không thể gõ như bình thường như thế nào vậy?

Mình vẫn gõ bình thường, thậm chí còn tốt hơn trước vì bây giờ nó chỉ gạch chân khi gặp những chữ cái tiếng Việt thôi (a => á, ă, â, d => đ,...) (Trong chế độ Enable Macro = OFF)

Nếu file PDF có metadata Title thì (một số) pdf viewer trên browser sẽ lấy ra để hiển thị. Còn không thì nó sẽ lấy tên file, mà tên file ở đây là cái path cuối cùng trên URL. (Hầu hết trình đọc pdf tên máy tính cũng vậy).

Còn cái filename trong header Content-Disposition chỉ có tác dụng khi download/lưu file, (một số) browser sẽ tự động đặt tên file download theo cái filename.

Muốn xem metadata (Title, Author, Publisher,...) thì vào document properties, còn khi generate từ Word, LibreOffice thì cần phải set properties cho document trước khi generate.

Btw, nếu là Laravel 5.5 trở đi thì chỉ cần thế này:

<?php
$folderName = config('filesystems.folder_test');
$fileName = $file->name;

return Storage::disk('s3')->response($folderName . '/' . $fileName, $fileName);